<template>
  <el-select  ref="enumsSelect" v-model="enumVal" @change="handleChange" >
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.name"
      :value="item.value">
    </el-option>
  </el-select>
</template>

<script>
/**
  暂不支持多选
  暂时只有下拉框，后续会加上单选，多选，switch
 */
import formUtils from '@/utils/formUtils';
export default {
  name: "fancyEnums",
  props:{
    value: {
        type: String,
        default: ''
    },
    type:{  //枚举类型
        type:String
    },
    search: {   //是否可以搜索//只有在下拉的模式才会出现
        type: Boolean,
        default: false
    },
    placeholder:{ //只有在下拉的模式才会出现
        type: Boolean,
        default: true
    },
    compType:{
      type: String,
      default:'select'    //默认是下拉框
    }
  },
  data() {
    return {
        options:[]    //枚举列表
        ,enumVal:''
    }
  },
  created(){
    this.getEnumsData();
    this.enumVal = this.value;
  },
  methods: {
      getEnumsData() {
        if(formUtils.isNotEmpty(this.type)){
            this.$fetch('/api/sys/enums/sys_enums_main/getEnumsByType',{
              type:this.type
            }).then((res) => {
              if(res.status==1){
                this.options = [];
                this.options = this.options.concat(res.data);
              }
            });
        }
      },
      handleChange(val) {
        const index = this.options.findIndex(item => item.value === val);
        this.$emit('input', val);
        this.$emit('onValueChange',this.options[index]);
      }
  },
};
</script>

<style scoped>
  
</style>